package com.example.myapplication.screen

import androidx.compose.foundation.background
import androidx.compose.foundation.border
import androidx.compose.foundation.layout.Arrangement
import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.PaddingValues
import androidx.compose.foundation.layout.fillMaxSize
import androidx.compose.foundation.layout.height
import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.layout.width
import androidx.compose.foundation.shape.RoundedCornerShape
import androidx.compose.material.icons.Icons
import androidx.compose.material.icons.filled.Home
import androidx.compose.material3.Button
import androidx.compose.material3.ButtonDefaults
import androidx.compose.material3.ElevatedButton
import androidx.compose.material3.FilledTonalButton
import androidx.compose.material3.Icon
import androidx.compose.material3.IconButton
import androidx.compose.material3.OutlinedButton
import androidx.compose.material3.Text
import androidx.compose.material3.TextButton
import androidx.compose.runtime.Composable
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.draw.clip
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.unit.dp

@Composable
fun ButtonExample(innerPadding: PaddingValues) {
    Column(
        verticalArrangement = Arrangement.spacedBy(10.dp, Alignment.CenterVertically),
        horizontalAlignment = Alignment.CenterHorizontally,
        modifier = Modifier.fillMaxSize()
            .padding(innerPadding)
            .background(color = Color.Cyan)
    ) {
        //1.普通按钮
        Button(
            colors = ButtonDefaults. buttonColors(contentColor = Color.Black, containerColor = Color.Yellow),
            modifier = Modifier
                .width(150.dp)
                .height(50.dp)
                .border(width = 5.dp, color = Color.Red, shape = RoundedCornerShape(30.dp))
                .clip(RoundedCornerShape(30.dp))
                .background(color = Color.Red),
            onClick = {
            println("按钮点击了")
        }) {
            Text("普通按钮")
        }

        //2.文本按钮
        TextButton(onClick = { println("我被点击了") }) {
            Text("文本按钮")
        }

        //3.带边框的按钮，背景透明，适合强调但不抢眼的按钮。
        OutlinedButton(onClick = { println("我被点击了") }) {
            Text("边框按钮")
        }

        //4.提供轻微阴影和浮动感的按钮，适合需要突出但不太显眼的按钮。
        ElevatedButton(onClick = { println("我被点击了") }) {
            Text("凸起按钮")
        }

        //5.介于 OutlinedButton 和 Button 之间，有轻微背景色，但不如 Button 强烈，适合较温和的视觉效果。
        FilledTonalButton(onClick = { println("我被点击了") }) {
            Text("填充色按钮")
        }

        //6.为只包含图标的按钮设计，适合用作应用栏或轻量化交互。
        IconButton(onClick = { println("我被点击了") }) {
            //可以去显示Jetpack Compose框架提供的默认图标集, 给无障碍模式的提示语
            Icon(Icons.Filled.Home, contentDescription = "Favorite")
        }

        //7.定义样式按钮
        Button(
            onClick = { println("我被点击了") },
            colors = ButtonDefaults.buttonColors(contentColor = Color.Black, containerColor = Color.Cyan),
            shape = RoundedCornerShape(10.dp)
        ) {
            Text("Custom Button")
        }
    }
}